let $, element, table;
layui.use(['jquery', 'element', 'table'], function () {
    $ = layui.jquery;
    element = layui.element;
    table = layui.table;
    // 覆盖layui的AJAX方法，添加请求头
    $.ajaxSetup({
        headers: {
            'Authorization': 'Bearer ' + localStorage.getItem(localStorage.getItem('userId') + ':token'),
            'tenantId': localStorage.getItem(localStorage.getItem('userId') + ':tenantId')
        }
    });
    tableRenter();
    addQueryCondition({
        "username": "用户名",
        "realName": "真实名",
        "type": "类型"
    });
    const urlParams = new URLSearchParams(window.location.search);
    const _menuCode = urlParams.get('pageCode');
    addButton(_menuCode);
});

function tableRenter() {
    table.render({
        elem: '#userPageTable'
        , url: '/user/page'
        , page: true
        , request: {
            pageName: 'current'
            , limitName: 'size'
        }
        , limit: 10
        , limits: [10, 20, 50, 100, 500]
        , method: 'GET'
        , cols: [[
            { field: 'id', title: 'ID', width: 80, sort: true, fixed: 'left' }
            , { field: 'username', title: '用户名', width: 200 }
            , { field: 'realName', title: '真实名', width: 300 }
            , { field: 'type', title: '类型', width: 80 }
            , { field: 'createdByName', title: '创建人', width: 200 }
            , { field: 'createdTime', title: '创建时间', width: 200, sort: true }
            , { field: 'updatedByName', title: '更新人', width: 200 }
            , { field: 'updatedTime', title: '更新时间', width: 200, sort: true }
        ]]
        , response: {
            statusName: 'code'
            , statusCode: 200
        }
    });
}

function addQueryCondition(queryData) {
    var power = localStorage.getItem(localStorage.getItem(localStorage.getItem('userId') + ':roleCode'));
    var powerList = JSON.parse(power);
    let html = ''
    Object.keys(queryData).forEach(function (key) {
        html += '<div class="layui-form-item layui-inline"><label class="layui-form-label">' + queryData[key] + '</label><div class="layui-input-block"><input type="text" name="' + key + '" placeholder="请输入' + queryData[key] + '" autocomplete="off" class="layui-input"></div></div>';
    });
    $("#userQueryCondition").html(html);
}

function addButton(_menuCode) {
    var power = localStorage.getItem(localStorage.getItem(localStorage.getItem('userId') + ':roleCode'));
    var powerList = JSON.parse(power);
    let html = ''
    $.each(powerList['sysButtons'], function (i, n) {
        if (powerList['sysButtons'][i].menuCode === _menuCode) {
            html += '<button class="layui-btn layui-btn-sm" onclick="' + powerList['sysButtons'][i].code + '()">' + powerList['sysButtons'][i].name + '</button>';
        }
    });
    $("#userButton").html(html);
}

function queryUserPage() {
    var formData = document.querySelectorAll("#userQueryCondition input");
    var params = {};
    for (var i = 0; i < formData.length; i++) {
        console.log(formData[i]);
        var data = formData[i];
        if (data.value === '') {
            continue;
        }
        params[data.name] = data.value;
    }
    table.reload('userPageTable', {
        where: params
    });
}

function addUser() {
    alert('新增按钮被点击！');
}

function resetUserPage() {
    var formData = document.querySelectorAll("#userQueryCondition input");
    var params = {};
    for (var i = 0; i < formData.length; i++) {
        console.log(formData[i]);
        var data = formData[i];
        data.value = '';
    }
}